<template style="padding: 0;margin: 0">

  <div class="bcDiv">
    <div style="height: 200px">

    </div>
    <div style="width: 500px; height: 400px; margin: auto;box-sizing: border-box;
    border: 1px solid whitesmoke;background-color: rgba(204,204,204,0.5)">
      <el-row style="margin-top: 80px">
        <el-col :span="2">
        </el-col>
        <el-col :span="5" style="font-size: 20px ;font-weight: bold;color: #42b983">
          <p>
            用户名：
          </p>
          <p>
            密码：
          </p>
        </el-col>
        <el-col :span="2">
        </el-col>
        <el-col :span="4">
          <p>
            <el-input v-model="userObj.userName" placeholder="请输入用户名" input-style="" style="width: 220px;"/>
          </p>

          <p>
            <el-input v-model="userObj.pwd" placeholder="请输入密码" type="password" input-style="" style="width: 220px;"/>
          </p>

        </el-col>

      </el-row>
      <el-col :span="4" style="padding-left: 300px">
        <p></p>

        <p> </p>
        <el-button type="primary" @click="land()" style="margin-top: 20px">登录</el-button>
      </el-col>




    </div>
  </div>
</template>

<script>
import axios from "axios"

export default {
  data() {
    return {
      userObj: {}
    }
  },
  methods: {
    land() {
      axios.get("/project/user/login", {
        params: this.userObj
      }).then(resp => {
        if (resp.data == "ok") {
          this.$router.push("/index");
        } else {
          alert("登录失败");
        }
      })
    }
  }
}
</script>

<style scoped>
.bcDiv {
  width: 100%;
  height: 1000px;
  background-image: url('@/./img/preview.jpg');
  background-size: 50%, 1000px;
}
</style>